<template>
    <div>
      <el-button @click="post">post</el-button>
      <el-button @click="get">get</el-button>
      <el-button @click="loginHandle">
        登陆
      </el-button>
    </div>
</template>

<script>
import utils from "@/plugins/utils.js"
export default{
    name: 'carrousel',
    data() {
      return {
        swiperOptions: {
          loop:true,
          autoplay: {
            delay: 3000
          },
         pagination: {
            el: '.swiper-pagination',
            clickable :true,
          },
        }
      }
    },
    computed: {
      swiper() {
        return this.$refs.mySwiper.$swiper
      }
    },
    mounted() {
    //   console.log('Current Swiper instance object', this.swiper)
    //   this.swiper.slideTo(3, 1000, false)
    },
    methods:{
      post(){
        this.$http.post('posts').then(res=>{
          console.log("=====post=====")
          console.log(res.data)          
        })
      },
      async get(){
       let result =  await this.$http.get('posts')
       console.log("=====get=====")
       console.log(result.data)
      },
        nextItem(){
          this.swiper
        },
        prevItem(){

        },
        loginHandle(){
            utils.setToken("token","test");
            this.$router.push({
              path:"/index"
            })
        }
    }
}
</script>

<style lang="scss" scoped>
.rotation-content{
  background: #f00;
  height: 400px;
  width: 100%;
}
.rotation-content h1{
  line-height: 400px;
  color: #f0f;
  text-align: center;
  font-size: 32px;
}
.login-title{
    text-align: center;
    font-size: 48px;
}
.swiper-container{
    --swiper-theme-color: #ff6600;
    --swiper-pagination-color: #00ff33;/* 两种都可以 */
  }


</style>
